<template>
  <el-table
    v-loading="pictLoading"
    element-loading-background="rgba(0, 0, 0, 0.5)"
    element-loading-text="数据正在加载中"
    element-loading-spinner="el-icon-loading"
    :default-expand-all="defaultexpandall"
    :row-key="rowkey"
    :tree-props="treeprops"
    :data="tableData"
    stripe
    style="width: 100%"
    @selection-change="handleSelectionChange"
  >
    <el-table-column type="selection" width="55" v-if="selection">
    </el-table-column>
    <el-table-column
      v-for="(v, i) in sunArr"
      :key="i"
      :prop="v"
      :label="fontArr[i]"
    >
    </el-table-column>
    <slot></slot>
    <el-table-column label="操作">
      <template slot-scope="{ row }">
        <el-button size="mini" type="text" v-if="update" @click="updateCli(row)"
          >修改</el-button
        >
        <el-button size="mini" type="text" v-if="del" @click="delCli(row)"
          >删除</el-button
        >
        <slot :row="row" name="oper"></slot>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
export default {
  props: {
    update: {
      type: Boolean,
      default: () => true,
    },
    del: {
      type: Boolean,
      default: () => true,
    },
    fontArr: {
      type: Array,
      default: () => [],
    },
    sunArr: {
      type: Array,
      default: () => [],
    },
    tableData: {
      type: Array,
      default: () => [],
    },
    selection: {
      type: Boolean,
      default: () => true,
    },
    selection: {
      type: Boolean,
      default: () => true,
    },
    defaultexpandall: {
      type: Boolean,
      default: () => false,
    },
    pictLoading: {
      type: Boolean,
      default: () => true,
    },
    rowkey: {
      type: String,
      default: () => "",
    },
    treeprops: {
      type: Object,
      default: () => ({}),
    },
  },
  data() {
    return {};
  },
  methods: {
    handleSelectionChange(val) {
      this.$emit("handleSelectionChange", val);
    },
    delCli(row) {
      this.$emit("delCli", row);
    },
    updateCli(row) {
      this.$emit("updateCli", row);
    },
  },
};
</script>

<style></style>
